<!-- 设备计划高级搜索 -->
<template>
    <div class="e-form">
       <el-form ref="form" :model="formData" label-width="100px">
            <el-row>
                <el-col :span="12">
                    <el-form-item label="姓名：">
                        <el-input v-model="formData.name"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系电话：">
                        <el-input v-model="formData.phoneNo"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="身份证号：">
                        <el-input v-model="formData.idCard"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="操作手范围：">
                        <el-input v-model="formData.operatingRange"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                    <el-form-item label="考评等级：">
                        <CheckAll :chackdData.sync="assessmentLevel" @checkdData="checkedLevel" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="工作状态：">
                        <CheckAll :chackdData.sync="workStatus" @checkdData="checkedworkStatus" ref="checkedState"/>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </div>
</template>

<script>
import { mapMutations, mapState } from 'vuex'
import CheckAll from '@/components/common/checkAll'
export default {
    data () {
        return {
            res: '',
            checkAll: false,
            checkedState: [], //选择的状态
            formData: {
                'assessmentLevel': [], //考评等级
                'idCard': '',  //身份证
                'keyword': '',
                'limit': 20,
                'name': '',  //姓名
                'operatingRange': '',  //操作范围
                'orgId': localStorage.getItem('searchOrgId'),
                'page': 1,
                'phoneNo': '', //电话
                'states': [],
                'workStatus': [] //工作状态
            }
        }
    },
    components: {
        CheckAll
    },
    computed: {
        ...mapState({
            stateForm: state => state.equip.equipData.state, //状态
            workStatus: state=>state.equip.equipData.workStatus, //工作状态
            assessmentLevel: state=>state.equip.equipData.assessmentLevel, //考评等级
        }),
        statusLable () {
            return param=> {
                const state =  this.$store.state.equip.equipData.state
                const obj = state.find(x=>x.value === param)
                return obj.label
            }
        },
    },
    watch: {
        formData: {
            handler (newVal) {
                this.setSearchData({ equipSearchData: newVal })
            },
            deep: true
        }
    },
    mounted () {
    },
    methods: {
        ...mapMutations(['setSearchData']),
        //获取选中的考评等级
        checkedLevel (states) {
            this.formData.assessmentLevel = states
        },
        //获取选中的工作状态
        checkedworkStatus (states) {
            this.formData.workStatus = states
        }

    },
}
</script>

<style lang='scss' scoped>
.separ{
        display: inline-block;
        font-weight: bold;
        width: 4%;
        margin: 0 1% 0 1%;
        text-align: center;
    }
  .e-form {
    padding: 20px;
}

</style>
